<!DOCTYPE html>
<html>

	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" charset="UTF-8">
		<title>购物车-百台云 - 直播你的梦想（https://www.100ytv.com）</title>
		<meta name="keywords" content="百台云">
		<meta name="description" content="百台云">
		<meta name="Copyright" content="百台云 All Rights Reserved">
		<meta name="Robots" content="All">
		<meta name="application-name" content="百台云 www.luoanziben.com">
		<meta name="msapplication-tooltip" content="百台云 www.luoanziben.com">
		<meta http-equiv="X-UA-Compatible" content="IE=Edge">
		<meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
		<meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
		<meta name="viewport" content="width=device-width" />
		<!--title小图标显示-->
		<link rel="icon" href="images/ico-logo.png" type="image/x-icon">
		<link rel="shortcut icon" href="images/ico-logo.png">
		<link rel="Bookmark" href="images/ico-logo.png">
		<!--样式文件-->
		<link rel="stylesheet" type="text/css" href="css/aui.css" />
		<link rel="stylesheet" type="text/css" href="css/bty.css" />
	</head>

	<body>
		<!--start:header头部-->
		<header id="bty_header" class="aui-bar aui-bar-nav">
			<a onclick="javascript:history.back(-1);" class="aui-pull-left aui-btn"> <span class="aui-iconfont aui-icon-left"></span> </a>
			<div class="aui-title">购物车(<span id="shopNum"></span>)</div>
			<div class="aui-pull-right aui-font-size-14" id="finished" onclick="allCheck();"> 编辑 </div>
		</header>
		<!--end:header头部--->

		<!--start:内容区域-->
		<ul class="aui-list aui-media-list bg-transparent">
			<!--<li class="shopsList aui-padded-0">
				<div class="aui-media-list-item-inner aui-border-b aui-margin-b-10 bg-white">
					<div class="aui-padded-5 aui-padded-r-0 vertical-center-1">
                    	<input class="aui-radio radioList" type="checkbox" name="" value="selectedIt" onclick="selectedIt(this)"> 
	                </div>
					
					<div class="aui-padded-5 vertical-center-1">
                    	<img options="size=120x120&bgcolor=#ccc&color=#ffffff&fsize=20&text=120x120" class="placeholder"/>
	                </div>
	                
					<div class="aui-list-item-inner">
						<div class=" aui-font-size-14 aui-margin-b-5">
							这里是内容区域，新版中的列表布局可以很轻松的帮助开发者完成常见列表样式。
						</div>
						<p class="aui-margin-b-5 aui-font-size-12">
							规格：
							<span>红色</span>
							<span>L码</span>
						</p>
						<div class="clearfix vertical-middle-2">
							<span class="aui-col-xs-5 aui-margin-l-5 text-red">￥<span>10000</span></span>
							<div class="aui-col-xs-6 aui-bar aui-bar-btn" type="count" id="demo" style="width:60%;display: inline-block;">
						        <span class="aui-bar-btn-item aui-font-size-12 aui-active" tapmode="" data-item-order="0">
						            <i class="aui-iconfont aui-icon-minus"></i>
						        </span>
						        <span class="aui-bar-btn-item" tapmode="" data-item-order="1">
						            <input class="aui-input aui-text-center" id="count" value="1">
						        </span>
						        <span class="aui-bar-btn-item aui-font-size-12" tapmode="" data-item-order="2">
						            <i class="aui-iconfont aui-icon-plus"></i>
						        </span>
						    </div>
						</div>
					</div>
							
				</div>
			</li>-->
			
			<li class="shopsList aui-padded-0">
				<div class="aui-margin-b-10 bg-white aui-padded-t-10 aui-padded-l-10">
					<input class="aui-radio radioListshop" type="checkbox" name="" onclick="radioListshop(this);"> 
                    <img options="size=30x30&bgcolor=#ccc&color=#ffffff&fsize=10&text=30x30" class="placeholder aui-img-round aui-inline aui-margin-r-5"/>
	                <span class="aui-card-list-user-info">北京朝阳</span>
	            	<!--商品列表-->
					<div class="aui-media-list-item-inner aui-border-b aui-margin-b-10 bg-white">
						<div class="aui-padded-5 aui-padded-r-0 vertical-center-1" >
	                    	<input class="aui-radio radioList" type="checkbox" name="" > 
		                </div>
						<div class="aui-padded-5 vertical-center-1"> 
							<img options="size=120x120&bgcolor=#ccc&color=#ffffff&fsize=20&text=120x120" class="placeholder"/> 
						</div>
						<div class="aui-list-item-inner">
							<div class=" aui-font-size-14 aui-margin-b-5">这里是内容区域，商品简介商品描述、文字文字文字。</div>
							<p class="aui-margin-b-5 aui-font-size-12">
								规格：<span>红色</span><span>L码</span>
							</p>
							<div class="clearfix vertical-middle-2">
								<p class="aui-col-xs-6 font-size-12 text-red">￥<span class="thisPrice">10000</span></p>
								<div class="aui-col-xs-6 aui-text-right" id="" style="width:50%;display: inline-block;">
						             <i class="aui-iconfont aui-icon-minus bg-gray aui-padded-5 minusBtn" onclick="minusNum(this);"></i>
					            <input class="aui-text-center numbers" value="1">
					            <i class="aui-iconfont aui-icon-plus bg-gray aui-padded-5 plusBtn" onclick="plusNum(this);"></i>
							    </div>
							</div>
						</div>
					</div>
					<!--商品列表-->
					<div class="shopsList aui-media-list-item-inner aui-border-b aui-margin-b-10 bg-white">
						<div class="aui-padded-5 aui-padded-r-0 vertical-center-1" >
	                    	<input class="aui-radio radioList" type="checkbox" name="" > 
		                </div>
						<div class="aui-padded-5 vertical-center-1"> 
							<img options="size=120x120&bgcolor=#ccc&color=#ffffff&fsize=20&text=120x120" class="placeholder"/> 
						</div>
						<div class="aui-list-item-inner">
							<div class=" aui-font-size-14 aui-margin-b-5">这里是内容区域，商品简介商品描述、文字文字文字。</div>
							<p class="aui-margin-b-5 aui-font-size-12">
								规格：<span>红色</span><span>L码</span>
							</p>
							<div class="clearfix vertical-middle-2">
								<p class="aui-col-xs-6 font-size-12 text-red">￥<span class="thisPrice">10009</span></p>
								<div class="aui-col-xs-6 aui-text-right" id="" style="width:50%;display: inline-block;">
						            <i class="aui-iconfont aui-icon-minus bg-gray aui-padded-5 minusBtn" onclick="minusNum(this);"></i>
						            <input class="aui-text-center numbers" value="1">
						            <i class="aui-iconfont aui-icon-plus bg-gray aui-padded-5 plusBtn" onclick="plusNum(this)"></i>
							    </div>
							</div>
						</div>
					</div>
				</div>
			</li>
			
			<li class="shopsList aui-padded-0">
				<div class="aui-media-list-item-inner aui-border-b aui-margin-b-10 bg-white">
					<div class="aui-padded-5 aui-padded-r-0 vertical-center-1" >
                    	<input class="aui-radio radioList" type="checkbox" name="" > 
	                </div>
					
					<div class="aui-padded-5 vertical-center-1">
                    	<img options="size=120x120&bgcolor=#ccc&color=#ffffff&fsize=20&text=120x120" class="placeholder"/>
	                </div>
	                
					<div class="aui-list-item-inner">
						<div class=" aui-font-size-14 aui-margin-b-5">
							这里是内容区域，新版中的列表布局可以很轻松的帮助开发者完成常见列表样式。
						</div>
						
						<p class="aui-margin-b-5 aui-font-size-12">
							规格：
							<span>红色</span>
							<span>L码</span>
						</p>
						
						<div class="clearfix vertical-middle-2">
							<p class="aui-col-xs-6 font-size-12 text-red">￥<span class="thisPrice">10000</span></p>
							<div class="aui-col-xs-6 aui-text-right" id="" style="width:50%;display: inline-block;">
					             <i class="aui-iconfont aui-icon-minus bg-gray aui-padded-5 minusBtn" onclick="minusNum(this);"></i>
					            <input class="aui-text-center numbers" value="1">
					            <i class="aui-iconfont aui-icon-plus bg-gray aui-padded-5 plusBtn" onclick="plusNum(this);"></i>
						    </div>
						</div>
							
					</div>
				</div>
			</li>
			
			<li class="shopsList aui-padded-0">
				<div class="aui-media-list-item-inner aui-border-b aui-margin-b-10 bg-white">
					<div class="aui-padded-5 aui-padded-r-0 vertical-center-1" >
                    	<input class="aui-radio radioList" type="checkbox" name="" > 
	                </div>
					
					<div class="aui-padded-5 vertical-center-1">
                    	<img options="size=120x120&bgcolor=#ccc&color=#ffffff&fsize=20&text=120x120" class="placeholder"/>
	                </div>
	                
					<div class="aui-list-item-inner">
						<div class=" aui-font-size-14 aui-margin-b-5">
							这里是内容区域，新版中的列表布局可以很轻松的帮助开发者完成常见列表样式。
						</div>
						
						<p class="aui-margin-b-5 aui-font-size-12">
							规格：
							<span>红色</span>
							<span>L码</span>
						</p>
						
						<div class="clearfix vertical-middle-2">
							<p class="aui-col-xs-6 font-size-12 text-red">￥<span class="thisPrice">9999</span></p>
							<div class="aui-col-xs-6 aui-text-right" id="" style="width:50%;display: inline-block;">
					            <i class="aui-iconfont aui-icon-minus bg-gray aui-padded-5 minusBtn" onclick="minusNum(this);"></i>
					            <input class="aui-text-center numbers" value="1">
					            <i class="aui-iconfont aui-icon-plus bg-gray aui-padded-5 plusBtn" onclick="plusNum(this);"></i>
						    </div>
						</div>
							
					</div>
				</div>
			</li>
			
			<li class="shopsList aui-padded-0">
				<div class="aui-media-list-item-inner aui-border-b aui-margin-b-10 bg-white">
					<div class="aui-padded-5 aui-padded-r-0 vertical-center-1" >
                    	<input class="aui-radio radioList" type="checkbox" name="" > 
	                </div>
					
					<div class="aui-padded-5 vertical-center-1">
                    	<img options="size=120x120&bgcolor=#ccc&color=#ffffff&fsize=20&text=120x120" class="placeholder"/>
	                </div>
	                
					<div class="aui-list-item-inner">
						<div class=" aui-font-size-14 aui-margin-b-5">
							这里是内容区域，新版中的列表布局可以很轻松的帮助开发者完成常见列表样式。
						</div>
						
						<p class="aui-margin-b-5 aui-font-size-12">
							规格：
							<span>红色</span>
							<span>L码</span>
						</p>
						
						<div class="clearfix vertical-middle-2">
							<p class="aui-col-xs-6 font-size-12 text-red">￥<span class="thisPrice">10000</span></p>
							<div class="aui-col-xs-6 aui-text-right" id="" style="width:50%;display: inline-block;">
					             <i class="aui-iconfont aui-icon-minus bg-gray aui-padded-5 minusBtn" onclick="minusNum(this);"></i>
					            <input class="aui-text-center numbers" value="1">
					            <i class="aui-iconfont aui-icon-plus bg-gray aui-padded-5 plusBtn" onclick="plusNum(this);"></i>
						    </div>
						</div>
							
					</div>
				</div>
			</li>
		</ul>
		<!--end:内容区域-->
		
		<!--start:footer-->
		<footer class="aui-bar aui-bar-tab clearfix" id="footer">
			<div class="aui-col-xs-12 clearfix" id="footer-prices">
				<div class="aui-col-xs-3 aui-padded-10 vertical-left-1 clearfix bg-white">
	        		<input id="allCheckBtn" class="aui-radio" type="checkbox" onclick="allcheck_btn()"/>
	        		<p class="aui-margin-l-5">全选</p>
				</div>
				<div class="aui-col-xs-6 aui-padded-0 clearfix bg-white total-prices">
					<div class="aui-text-right overflow-hidden aui-padded-r-5 text-block vertical-center-1">
						总计：<span class="text-red">￥<span id="prices">999,99.99999</span></span>
					</div>
					<p class="font-size-12 aui-text-center">（不含运费）</p>
				</div>
				<a class="aui-col-xs-3 clearfix">
					<span class="aui-btn aui-btn-block" id="closeAll">结算</span>
					<span class="aui-btn aui-btn-block" id="deleteAll" onclick="closeAll();">全部删除</span>
				</a>
			</div>
					
			<div class="aui-col-xs-12 clearfix">
			    <a href="index.html" class="aui-bar-tab-item" tapmode>
			        <i class="aui-iconfont aui-icon-home"></i>
			        <div class="aui-bar-tab-label">商城</div>
			    </a>
			    <a href="" class="aui-bar-tab-item" tapmode>
			        <i class="aui-iconfont aui-icon-video"></i>
			        <div class="aui-bar-tab-label">直播</div>
			    </a>
			    <a href="shopCart.html" class="aui-bar-tab-item aui-active" tapmode>
			        <i class="aui-iconfont aui-icon-cart"></i>
			        <div class="aui-bar-tab-label">购物车</div>
			    </a>
			    <a href="my.html" class="aui-bar-tab-item" tapmode>
			        <i class="aui-iconfont aui-icon-my"></i>
			        <div class="aui-bar-tab-label">我的</div>
			    </a>
			</div>
		</footer>
		<!--end:footer-->
	</body>
	<script type="text/javascript" src="js/api.js"></script>
	<script type="text/javascript" src="js/aui-slide.js"></script>
	<script type="text/javascript" src="js/aui-tab.js"></script>
	<script type="text/javascript" src="js/aui-pull-refresh.js"></script>
	<script type="text/javascript" src="js/aui-scroll.js"></script>
	<script type="text/javascript" src="js/aui-dialog.js"></script>
	<script src="js/placeholder.min.js" type="text/javascript" charset="utf-8"></script>
	<script type="text/javascript" src="js/zepto.js" charset="utf-8"></script>
	<script type="text/javascript">
		//头部脚部占位div
 		$('#bty_header').after('<div style="height:'+ $('#bty_header').height()  +'px"></div>');
 		$('#footer').after('<div style="height:'+ $('#footer').height()  +'px;background:transparent;"></div>');
		
		function amount(){shopNum.innerText = $('.radioList').length;}
		amount()
			
		var moreChecked_flag = true;
		function allCheck(){
			var moreChecked = document.getElementsByClassName('radioList');
			var finished = document.getElementById('finished');
			if(moreChecked_flag){
				finished.innerText = '完成';
				document.getElementById("closeAll").style.display = "none";
				footer_holder.style.height = footer.offsetHeight+10+'px'; 
				footer_holder.style.backgroundColor = 'transparent';
				moreChecked_flag=false;
			}else{
				finished.innerText = '编辑';
				document.getElementById("closeAll").style.display = 'block';
				moreChecked_flag=true;
			}
		}
		
		var allChecked_flag = true;
		function allcheck_btn(){
			var btn=document.getElementsByClassName('radioList');
			var shopsBtn=document.getElementsByClassName('radioListshop');
			if(allChecked_flag){
				allCheckBtn.setAttribute("checked","checked");
				for(var j=0;j<btn.length;j++){ 
					btn[j].setAttribute("checked","checked"); 
				}
				for(var k=0;k<shopsBtn.length;k++){ 
					shopsBtn[k].setAttribute("checked","checked"); 
				}
				allChecked_flag = !allChecked_flag;
			}else if(!allChecked_flag){
				allCheckBtn.removeAttribute("checked");
				for(j=0;j<btn.length;j++){ btn[j].removeAttribute("checked"); }
				for(var k=0;k<shopsBtn.length;k++){ 
					shopsBtn[k].removeAttribute("checked"); 
				}
				allChecked_flag = !allChecked_flag;
			}
		}
		
		//数量加减
	    apiready = function(){
	        api.parseTapmode();
	    }
	    var bar = document.querySelectorAll(".aui-bar-btn");
	    if(bar){
	        for(var i=0; i<bar.length;i++){
	            var d = bar[i];
	            var tab = new auiTab({
	                element:bar[i],
	                repeatClick:true
	            },function(ret){
	                if(ret.dom.parentNode.getAttribute("type") && ret.dom.parentNode.getAttribute("type")=="count"){
	                    var count = parseInt(document.getElementById("count").value);
	                    if(ret.index==2)return;
	                    if(ret.index==1){
	                        document.getElementById("count").value = count-1;
	                        if(document.getElementById("count").value<=1){
	                        	document.getElementById("count").value = 1;
	                        }
	                    }
	                    if(ret.index==3){
	                        document.getElementById("count").value = count+1;
	                    }
	                }
	            });
	
	        }
	    }
		
		function selectedIt(t){
//			console.log( t );
		}
		
		function closeAll(){
			var btn=document.getElementsByClassName('radioList');
			var a = 0;
			for(j=0;j<btn.length;j++){ 
				btn[j].checked;
				if(btn[j].checked){
					a++;
					btn[j].remove();
					document.getElementsByClassName('aui-media-list-item-inner')[j].remove();
					function closedBtn (){
						var num =document.getElementsByClassName('thisPrice')[j].innerText;
					}
				}
				
			}
		}
		
		var shoplistFlag = true;
		function radioListshop (t){
			var shopList = t.parentElement.getElementsByClassName('aui-media-list-item-inner');
			if(shoplistFlag){
				for(i=0;i<shopList.length;i++){ 
					shopList[i].childNodes[1].childNodes[1].setAttribute("checked","checked");
//					console.log( shopList[i].childNodes[1].childNodes[1].checked );
				}
				shoplistFlag=!shoplistFlag;
			}else {
				for(i=0;i<shopList.length;i++){ shopList[i].childNodes[1].childNodes[1].removeAttribute('checked');}
				shoplistFlag=!shoplistFlag;
			}
		}
			
		//数量加减
		function plusNum (t){
			var shopsNumber = t.parentNode.childNodes[3];
			shopsNumber = shopsNumber.value++;
		}
		function minusNum (t){
			var shopsNumber = t.parentNode.childNodes[3];
			if(shopsNumber.value==1){
				shopsNumber = 1;
			}else{
				shopsNumber = shopsNumber.value--;
			}
		}
		
		var prices =document.getElementById('prices');
		prices.innerText
		
	</script>
</html>